import { useEffect, useState } from "react";
import { Button, Card, Image, List } from "tdesign-react";
import ListItem from "tdesign-react/es/list/ListItem";
import ListItemMeta from "tdesign-react/es/list/ListItemMeta";

const Home = () => {
  const [host_list, set_host_list] = useState<Array<any>>([]);

  const update = () => {
    console.log("send request");
    (window as any).go.main.App.GetReport()
      .then((respon: any) => {
        console.log("请求成功。。。。。");
        console.log(respon);
        console.log(respon.datas);
        set_host_list(respon.datas);
      })
      .catch((err: any) => {
        console.log(err);
      });
  };

  useEffect(() => {
    update();
  }, []);

  return (
    <div>
      <Card style={{ height: 700, width: 600 }}>
        <List size="small" style={{ height: 600, width: 500 }}>
          {host_list.map((item) => (
            <ListItem key={item.id}>
              <Image
                src={item.owner.avatar_url}
                shape="circle"
                style={{ height: 40, width: 40 }}
              />
              <ListItemMeta description={item.name} />
            </ListItem>
          ))}
        </List>
      </Card>
      <Button onClick={update}>update</Button>
    </div>
  );
};

export default Home;
